feat: link package names to npm in html report by bharatmalik-cs · Pull Request #1021 · OWASP/cve-lite-cli

bharatmalik-cs · 2026-08-20T13:40:04Z

Wraps package names in dependency path chips, chain-proof hops, and finding header with links to their npm page (https://www.npmjs.com/package/).

sonukapoor

Good first PR - the approach is right and escapeHtml is used correctly throughout. Three small things to fix before we merge.

sonukapoor · 2026-08-20T16:04:30Z

    : `<span class="fix-hint none" title="No known fix — consider replacing this package">⚠ No fix</span>`;

-  const depPathHtml = finding.dependencyPaths.length > 0
+const depPathHtml = finding.dependencyPaths.length > 0


const depPathHtml lost its indent - should be 2 spaces in to match the surrounding code.

sonukapoor · 2026-08-20T16:04:30Z

-        return `<span class="dep-node${isLast ? " vulnerable" : ""}">${escapeHtml(node)}</span>${isLast ? "" : '<span class="dep-arrow">→</span>'}`;
+        const isFirst = i === 0;
+        const label = isFirst
+          ? escapeHtml(node)


The first hop is also a package on npm - no need to skip it. Remove the isFirst check and just always wrap node in the link.

sonukapoor · 2026-08-20T16:04:30Z

        <td><span class="expand-icon" id="icon-${idx}">▶</span></td>
-        <td><div class="pkg-name">${escapeHtml(finding.package)}</div><div class="pkg-version">${escapeHtml(finding.version)}</div></td>
-        <td>${fixHtml}</td>
+        <td><div class="pkg-name"><a href="https://www.npmjs.com/package/${escapeHtml(finding.package)}" target="_blank" rel="noopener noreferrer">${escapeHtml(finding.package)}</a></div><div class="pkg-version">${escapeHtml(finding.version)}</div></td>        <td>${fixHtml}</td>


<td>${fixHtml}</td> got merged onto the end of the line above. Put it on its own line.

sonukapoor

Good progress on removing the isFirst skip and using encodeURIComponent in the href. Two functional bugs to fix before merge.

sonukapoor · 2026-08-20T23:51:21Z

-      }).join("")
-    : `<span class="dep-node">${escapeHtml(finding.package)}</span>`;
+    && finding.dependencyPaths[0].map((node, i, arr) => {
+  const isLast = i === arr.length - 1;


Switching from a ternary to && dropped the fallback. When finding.dependencyPaths.length === 0, depPathHtml is now false, which renders as the literal text false in the HTML. Restore the ternary:

const depPathHtml = finding.dependencyPaths.length > 0 ? finding.dependencyPaths[0].map((node, i, arr) => { const isLast = i === arr.length - 1; return `<a href="https://www.npmjs.com/package/${encodeURIComponent(node)}" target="_blank" rel="noopener noreferrer" class="dep-node${isLast ? " vulnerable" : "}">${escapeHtml(node)}</a>${isLast ? "" : '<span class="dep-arrow">→</span>'}`; }).join("") : `<span class="dep-node">${escapeHtml(finding.package)}</span>`;

sonukapoor · 2026-08-20T23:51:21Z

+  const label = escapeHtml(node);
+
+  return `<a href="https://www.npmjs.com/package/${encodeURIComponent(node)}" target="_blank" rel="noopener noreferrer" class="dep-node${isLast ? " vulnerable" : ""}">${label}</a>${isLast ? "" : '<span class="dep-arrow">→</span>'}`;})



Missing .join("") - .map() returns an Array, and when you interpolate it into the template string it joins with commas by default. Add .join("") after the closing }).

sonukapoor · 2026-08-20T23:51:21Z

        <td><span class="expand-icon" id="icon-${idx}">▶</span></td>
-        <td><div class="pkg-name">${escapeHtml(finding.package)}</div><div class="pkg-version">${escapeHtml(finding.version)}</div></td>
-        <td>${fixHtml}</td>
+        <td><div class="pkg-name"><a href="https://www.npmjs.com/package/${escapeHtml(finding.package)}" target="_blank" rel="noopener noreferrer">${escapeHtml(finding.package)}</a></div><div class="pkg-version">${escapeHtml(finding.version)}</div></td>        <td>${fixHtml}</td>


<td>${fixHtml}</td> is still on the same line as the pkg-name cell. Put it on its own line.

sonukapoor

Getting close - the ternary fallback is back, .join("") is there, and the dep-path links look right. Two more things to fix.

sonukapoor · 2026-08-21T12:29:50Z

 import type { MaintenanceFinding } from "../maintenance/types.js";
 import { UNVERIFIED_PARENT_UPGRADE_NOTE, type SuggestedFixCommandPlan } from "../remediation/fix-commands.js";
 import { getCompletenessImpact } from "../scan/completeness.js";
+import { escape } from "node:querystring";


This import is unused - escape from node:querystring is never called anywhere in the file. Remove it (it will also fail the build if noUnusedLocals is enabled).

sonukapoor · 2026-08-21T12:29:50Z

@@ -586,10 +587,9 @@ export function renderFindingRow(finding: SerializedFinding, idx: number, skippe
  const rootDepsHtml = finding.rootDependencies.length > 0
    ? finding.rootDependencies.map(name => `<span class="root-dep">${escapeHtml(name)}</span>`).join(", ")


The pkg-name cell link uses escapeHtml() in the href, but it should use encodeURIComponent() - same as you're doing for dep path nodes above. escapeHtml converts & to & which breaks the URL. For scoped packages like @babel/core this would produce href="https://www.npmjs.com/package/@babel/core" correctly by accident, but the right function for URL encoding is encodeURIComponent:

<a href="https://www.npmjs.com/package/${encodeURIComponent(finding.package)}" ...>

sonukapoor

Both issues resolved - encodeURIComponent is used correctly throughout (dep path nodes, pkg-name cell, chain proof hops), and the unused escape import is gone. Merging.

bharatmalik-cs · 2026-08-23T06:15:28Z

hey, do i need to merge this or it will be automatically merged as i cannot see the option to merge

…

On Sun, Aug 23, 2026 at 10:07 AM Sonu Kapoor ***@***.***> wrote: ***@***.**** approved this pull request. Both issues resolved - encodeURIComponent is used correctly throughout (dep path nodes, pkg-name cell, chain proof hops), and the unused escape import is gone. Merging. — Reply to this email directly, view it on GitHub <#1021?email_source=notifications&email_token=BXZDMU33Q272KLQ4WNM6MYT5LJYINA5CNFSNUABKM5UWIORPF5TWS5BNNB2WEL2QOVWGYUTFOF2WK43UKJSXM2LFO4XTKMBQGE3DMMZYGE3KM4TFMFZW63VGMF2XI2DPOKSWK5TFNZ2KYZTPN52GK4S7MNWGSY3L#pullrequestreview-5001663816>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BXZDMU5EUB74TJQP6KEDO7T5LJYINAVCNFSNUABGKJSXA33TNF2G64TZHMYTCOJUGA2DMMRSG45US43TOVSTWNJSGA2DAMZTGYYDNILWAI> . Triage notifications, keep track of coding agent tasks and review pull requests on the go with GitHub Mobile for iOS <https://github.com/notifications/mobile/ios/BXZDMU34RCUMFINJA5N3WS35LJYINA5CNFSNUABKM5UWIORPF5TWS5BNNB2WEL2QOVWGYUTFOF2WK43UKJSXM2LFO4XTKMBQGE3DMMZYGE3KM4TFMFZW63VGMF2XI2DPOKSWK5TFNZ2KUZTPN52GK4S7NFXXG> and Android <https://github.com/notifications/mobile/android/BXZDMU6XBLPNMHQXUWRTMVL5LJYINA5CNFSNUABKM5UWIORPF5TWS5BNNB2WEL2QOVWGYUTFOF2WK43UKJSXM2LFO4XTKMBQGE3DMMZYGE3KM4TFMFZW63VGMF2XI2DPOKSWK5TFNZ2K4ZTPN52GK4S7MFXGI4TPNFSA>. Download it today! You are receiving this because you authored the thread.Message ID: ***@***.***>

sonukapoor

Nice addition - clickable npm links are a small but genuinely useful touch in the HTML report.

sonukapoor · 2026-08-24T12:57:12Z

Merged - thank you @bharatmalik-cs!

feat: link package names to npm in html report

cd43fe3

bharatmalik-cs requested a review from sonukapoor as a code owner August 20, 2026 13:40

sonukapoor requested changes Aug 20, 2026

View reviewed changes

bharatmalik-cs added 2 commits August 20, 2026 21:55

Made all the required changes

6d650c7

fix: link all dependency path nodes

ba6126f

sonukapoor requested changes Aug 20, 2026

View reviewed changes

fix : review changes were addressed

24b2ca7

sonukapoor requested changes Aug 21, 2026

View reviewed changes

fix: use encodeURIComponent for npm links, drop unused import

d34726f

sonukapoor approved these changes Aug 23, 2026

View reviewed changes

Merge branch 'main' into fix/npm-links-in-report

328074b

sonukapoor approved these changes Aug 24, 2026

View reviewed changes

sonukapoor merged commit c60a064 into OWASP:main Aug 24, 2026
6 checks passed

sonukapoor mentioned this pull request Aug 27, 2026

release: v1.31.0 #1049

Merged

		const label = escapeHtml(node);

		return `<a href="https://www.npmjs.com/package/${encodeURIComponent(node)}" target="_blank" rel="noopener noreferrer" class="dep-node${isLast ? " vulnerable" : ""}">${label}</a>${isLast ? "" : '<span class="dep-arrow">→</span>'}`;})

		@@ -586,10 +587,9 @@ export function renderFindingRow(finding: SerializedFinding, idx: number, skippe
		const rootDepsHtml = finding.rootDependencies.length > 0
		? finding.rootDependencies.map(name => `<span class="root-dep">${escapeHtml(name)}</span>`).join(", ")

Uh oh!

Uh oh!

Conversation

bharatmalik-cs commented Aug 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

sonukapoor left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

sonukapoor left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

sonukapoor left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

sonukapoor left a comment

Choose a reason for hiding this comment

Uh oh!

bharatmalik-cs commented Aug 23, 2026 via email

Uh oh!

sonukapoor left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

sonukapoor commented Aug 24, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

bharatmalik-cs commented Aug 20, 2026 •

edited

Loading